<template>
	<view class="container">
		<view class="infoList_TimeData">
			<view v-for="(item,index) in sentInfoList" :key="index">
				<view class="sentTimes">
					<text class="timeJudgment" v-if="dateYMDay == item.sentYMDay">今天</text>
					<text class="timeJudgment" v-else-if="item.sentYMDay == datePrevTwoDay">昨天</text>
					<text class="timeJudgment" v-else>{{item.sentYMDay}}</text>
					<view v-for="(item_2,index) in item.sentInfo" :key="index" v-if="item_2.sentYMDay == item.sentYMDay"
						@click="toCareInfo(item_2.names,item_2.content)">
						<view class="info_pre">
							<view class="image">
								<image :src=item_2.image mode="aspectFit"></image>
							</view>
							<view class="names" v-if="item_2.details.length == userLength">
								所有人:
							</view>
							<view class="names" v-else>
								{{item_2.names}}:
							</view>
							<view class="contentTxt">
								{{item_2.content}}
							</view>
							<view class="time">
								{{item_2.sentTime}}
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// title: '主动关怀',
				infoListData: [],
				sentInfoTime: [],
				sentInfoList: [],
				dateMonthDay: '',
				datePrevTwoDay: '',
				userId: '',
				userLength: ''
			}
		},
		onLoad() {
			this.getUserId();
		},
		onShow() {
			this.getInfoList();
			this.getDate();
			this.screenUser();
		},
		onPullDownRefresh() {
			setTimeout(() => {
				uni.stopPullDownRefresh();
				this.getInfoList();
			}, 1000);
		},
		methods: {
			//------------------------------------------------
			//获取当前发送者的id
			getUserId() {
				this.userId = uni.getStorageSync('id');
			},
			//-----------------------------------------------------------------
			//获取用户信息的长度
			async screenUser() {
				const res = await this
					.$myRequest({ //await 关键字 只能放在 async 函数内部， await关键字的作用 就是获取 Promise中返回的内容， 获取的是Promise函数中resolve或者reject的值
						url: '/api-operate/noSponsorMembers',
						method: "get",
					})
				if (res.success == true) {
					this.userLength = res.body.members.length;
				}
			},
			//-------------------------------------------
			//获取当前时间对比发送时间
			getDate() {
				var date = new Date();
				var year = date.getFullYear(),
					month = date.getMonth() + 1,
					day = date.getDate() < 10 ? ("0" + date.getDate()) : date.getDate();
				month > 0 && month < 10 ? (month = "0" + month) : '';
				this.dateYMDay = year + "-" + month + "-" + day;
				var day1 = new Date();
				day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000);
				var prevDay = day1.getDate();
				var prevMonth = day1.getMonth() + 1;
				prevDay = prevDay < 10 ? ("0" + prevDay) : prevDay;
				prevMonth = prevMonth < 10 ? ("0" + prevMonth) : prevMonth;
				var s1 = day1.getFullYear() + "-" + prevMonth + "-" + prevDay;
				this.datePrevTwoDay = s1;
			},
			//-------------------------------------------
			//跳转到信息发送界面
			onNavigationBarButtonTap() {
				uni.navigateTo({
					url: "/pages/care/caring/caring"
				})
			},
			//-----------------------------------------------
			//获取当前发送者的发送信息
			async getInfoList() {
				const res = await this
					.$myRequest({ //await 关键字 只能放在 async 函数内部， await关键字的作用 就是获取 Promise中返回的内容， 获取的是Promise函数中resolve或者reject的值
						url: '/api-operate/activecare/bySponsor/' + this.userId,
						method: "get",
					})
				if (res.success == true) {
					this.infoListData = res.body.command;
					for (let i in this.infoListData) {
						this.infoListData[i].image = '/static/image/personages.png';
						var sentDates = this.infoListData[i].sentDate;
						var timearr = sentDates.replace(" ", ":").replace(/\:/g, "-").split("-");
						this.infoListData[i].sentDate = timearr[0] + "-" + timearr[1] + "-" + timearr[
								2] + " " +
							timearr[3] + ":" +
							timearr[4];
						this.infoListData[i].sentYMDay = timearr[0] + "-" + timearr[1] + "-" + timearr[
							2];
						this.infoListData[i].sentTime = timearr[3] + ":" + timearr[4];
						if (this.sentInfoTime.indexOf(this.infoListData[i].sentYMDay) == -1) {
							this.sentInfoTime.push(this.infoListData[i].sentYMDay);
						}
					}
					let obj = Object.assign({}, this.sentInfoTime);
					let resultArr = [];
					for (let key in obj) {
						let objs = new Object();
						objs.sentYMDay = obj[key];
						resultArr.push(objs);
					}
					for (let num in resultArr) {
						resultArr[num].sentInfo = [];
						for (let num2 in this.infoListData) {
							if (resultArr[num].sentYMDay == this.infoListData[num2].sentYMDay) {
								resultArr[num].sentInfo.push(this.infoListData[num2]);
							}
						}
					}
					this.sentInfoList = resultArr;
					this.sentInfoList.sort(function(a, b) {
						return a.sentYMDay < b.sentYMDay ? 1 : -1;
					})
				}
			},
			//-------------------------------------------------------
			//查看信息详情
			toCareInfo(names, content) {
				uni.navigateTo({
					url: "/pages/care/careInfo/careInfo?names=" + names + "&content=" + content
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.infoList_TimeData {
		margin-top: 2%;

		view {
			width: 100%;

			.sentTimes {
				.timeJudgment {
					width: 100%;
					display: flex;
					justify-content: center;
					font-size: 32rpx;
					color: #000000;
				}
			}

			.info_pre {
				width: 80%;
				height: 140rpx;
				margin: 4% auto;
				border: 1px solid #e1e1e1;
				box-shadow: 1px 1px 10px #9eaeb5;
				background-color: white;
				border-radius: 8px;
				position: relative;

				.image {
					float: left;
					width: 150rpx;
					height: 100%;
					position: relative;

					image {
						width: 96rpx;
						height: 96rpx;
						position: absolute;
						top: 0;
						bottom: 0;
						left: 0;
						right: 0;
						margin: auto auto;
					}
				}

				.names {
					width: 30%;
					margin: 3% 0;
					font-size: 32rpx;
					color: #000000;
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
				}

				.contentTxt {
					width: 68%;
					margin: 3% 0;
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
					font-size: 32rpx;
					color: #000000;
				}

				.time {
					position: absolute;
					right: 0;
					top: 0;
					width: 100rpx;
					text-align: center;
					margin-top: 3%;
					margin-right: 2%;
				}
			}
		}
	}
</style>
